<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>螺蛳粉详情</title>
    <link rel="shortcut icon" href="../favicon.ico">
    <link rel="stylesheet" href="../common/base.css">
    <!-- 引入头部样式 -->
    <link rel="stylesheet" href="../layout/head/index.css">
    <!-- 引入底部样式 -->
    <link rel="stylesheet" href="../layout/footer/index.css">
    <link rel="stylesheet" href="./index.css">
    <link rel="stylesheet" href="../layout/helper/index.css">

</head>

<body id="to-head">
    <!-- 头部开始 -->
    <div class="head-container" >
        <div class="head-wrapper">
            <div class="nav-wrapper">
                <h1 class="logo-wrapper">
                    <a href="../index.html" class="logo">
                        <img src="../image/logo.png" alt="" class="logo-img">
                    </a>
                </h1>

                <div class="nav-list">
                    <ul class="nav-items">
                        <li class="nav-item"><a href="../food/index.html" target="_self" class="nav-link">广西美食</a>
                        </li>
                        <li class="nav-item"><a href="../scenery/index.html" target="_self" class="nav-link">广西美景</a>
                        </li>
                        <li class="nav-item"><a href="../specialty/index.html" target="_self" class="nav-link">广西特产</a></li>
                        <li class="nav-item"><a href="../festival/index.html" target="_self" class="nav-link">特色节日</a>
                        </li>
                        <li class="nav-item"><a href="../contact/index.html" target="_self" class="nav-link">联系我们</a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="login-wrapper">
                <div class="login-btn">
                    <a href="../login/login.html">
                        <div class="btn">登录</div>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <!-- 头部结束 -->
    <!-- 详情页面开始 -->
    <div class="food-container">
        <div class="food-wrapper">
            <div class="history-wrapper">
                <div class="top">
                    <div class="top-wrapper"> <img src="../image/历史.svg" alt="" class="top-img"></div>
                    <span class="title">历史渊源</span>
                </div>
                <div class="bottom">
                    <div class="left">
                        <img src="../image/luosifen3.jpg" alt="" class="left-img">
                    </div>
                    <div class="right">
                        <p class="name">螺蛳粉</p>
                        <p class="content"> 广西壮族自治区柳州市特色小吃之一!</p>
                    </div>
                </div>
            </div>
            <div class="make-wrapper">
                <div class="make-top">
                    <div class="make-top-wrapper">
                        <img src="../image/煲汤制作培训.svg" alt="" class="make-top-img">
                    </div>
                    <span class="make-title">制作工艺</span>
                </div>
                <div class="make-center">
                    <div class="make-left">
                        <img src="../image/lsfzzgy.png" alt="" class="make-left-img">
                    </div>

                </div>
                <div class="make-bottom">
                    <div class="material">
                        <fieldset class="material-fieldset">
                            <legend class="material-title">主料</legend>
                            <div>

                                <ul class="material-items">
                                    <li class="material-item">
                                        <p class="material-name">米粉</p>
                                        <p class="calculate">150g</p>
                                    </li>
                                    <li class="material-item">
                                        <p class="material-name">螺蛳</p>
                                        <p class="calculate">50g</p>
                                    </li>
                                    <li class="material-item">
                                        <p class="material-name">腐竹</p>
                                        <p class="calculate">20g</p>
                                    </li>
                                </ul>
                            </div>
                        </fieldset>
                        <div class="material">
                            <fieldset class="material-fieldset">
                                <legend class="material-title">辅料</legend>
                                <div>

                                    <ul class="material-items">
                                        <li class="material-item">
                                            <p class="material-name">酸笋</p>
                                            <p class="calculate">50g</p>
                                        </li>
                                        <li class="material-item">
                                            <p class="material-name">酸菜</p>
                                            <p class="calculate">40g</p>
                                        </li>
                                        <li class="material-item">
                                            <p class="material-name">猪脊骨</p>
                                            <p class="calculate">200g</p>
                                        </li>
                                        <li class="material-item">
                                            <p class="material-name">生菜</p>
                                            <p class="calculate">60g</p>
                                        </li>
                                        <li class="material-item">
                                            <p class="material-name">炸花生米</p>
                                            <p class="calculate">20g</p>
                                        </li>
                                        <li class="material-item">
                                            <p class="material-name">萝卜干</p>
                                            <p class="calculate">40g</p>
                                        </li>
                                        <li class="material-item">
                                            <p class="material-name">黑木耳</p>
                                            <p class="calculate">40g</p>
                                        </li>
                                        <li class="material-item">
                                            <p class="material-name">葱花</p>
                                            <p class="calculate">10g</p>
                                        </li>
                                    </ul>
                                </div>
                            </fieldset>
                            <div class="material">
                                <fieldset class="material-fieldset">
                                    <legend class="material-title">调料</legend>
                                    <div>

                                        <ul class="material-items">
                                            <li class="material-item">
                                                <p class="material-name">食盐</p>
                                                <p class="calculate">10g</p>
                                            </li>
                                            <li class="material-item">
                                                <p class="material-name">味精</p>
                                                <p class="calculate">3g</p>
                                            </li>
                                            <li class="material-item">
                                                <p class="material-name">菜籽</p>
                                                <p class="calculate">5g</p>
                                            </li>
                                            <li class="material-item">
                                                <p class="material-name">料酒</p>
                                                <p class="calculate">5g</p>
                                            </li>
                                            <li class="material-item">
                                                <p class="material-name">酱酒</p>
                                                <p class="calculate">5g</p>
                                            </li>

                                        </ul>
                                    </div>
                                </fieldset>
                            </div>
                            <div class="method">
                                <span class="method-title make-title">制作方法</span>
                                <ol class="method-items">
                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf1.jpg" alt=""
                                                class="item-img"></div>
                                        <div class="method-item-desc"><span class="item-part">1.</span>
                                            准备好需要的配料</div>
                                    </li>
                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf2.jpg" alt=""></div>
                                        <div class="method-item-desc"><span class="item-part">2.</span>
                                            将干米粉取出放入凉水中浸泡10分钟左右，这里只教最正确的步骤，一般人我还真不告诉她</div>
                                    </li>
                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf3.jpg" alt=""></div>
                                        <div class="method-item-desc"><span class="item-part">3.</span>
                                            烧适量水，将泡过的干米粉待水开后放入锅中煮</div>
                                    </li>
                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf4.jpg" alt=""></div>
                                        <div class="method-item-desc"><span class="item-part">4.</span>
                                            煮至米粉软嫩即可，常理应该在10-15分钟左右，煮的时间应该要凭感觉，凭经验，要稳、准、狠，各人对于粉的软嫩接受程度各不相同。
                                        </div>
                                    </li>
                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf5.jpg" alt=""></div>
                                        <div class="method-item-desc"><span class="item-part">5.</span>
                                            将粉滤出放入“盆”内，这里需要用到滤网，其主要目的是为了过滤掉水中的米浆，属于正常现象，可放心食用的哈</div>
                                    </li>
                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf6.jpg" alt=""></div>
                                        <div class="method-item-desc"><span class="item-part">6.</span>
                                            重新烧一锅水，放入各类你喜欢的青菜，稍微煮一会儿熟了就可以捞出来备用（这里推荐空心菜、生菜和上海青）</div>
                                    </li>
                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf7.jpg" alt=""></div>
                                        <div class="method-item-desc"><span class="item-part">7.</span>
                                            将煮好的青菜，剥好的卤蛋，酸笋包、酸豆角萝卜干包、木耳包、腐竹花生包放入之前装有粉的碗中，配料不用煮。
                                    </li>
                                    
                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf9.jpg" alt=""></div>
                                        <div class="method-item-desc"><span class="item-part">8.</span>
                                            烧少许水，放入卤水包和酸醋包共同煮制，煮开即可。
                                        </div>
                                    </li>

                                   
                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf13.jpg" alt=""></div>
                                        <div class="method-item-desc"><span class="item-part">9.</span>
                                            淋汁儿！汤底是用螺蛳精酿而成，没说螺蛳粉就不能有螺肉啊，这只能说是标配和高配之间的区别
                                        </div>
                                    </li>

                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf15.jpg" alt=""></div>
                                        <div class="method-item-desc"><span class="item-part">10.</span>
                                            最后一步淋上红油，瞬间高逼格有木有，此款红油香醇无比，喜欢吃辣的亲们千万不要错过啦</div>
                                    </li>
                                    <li class="method-item">
                                        <div class="method-item-img"><img src="../image/lsf16.jpg" alt=""></div>
                                        <div class="method-item-desc"><span class="item-part">11.</span>
                                            嗦起来，吃一口就忘不了的味道，真正的尝不忘</div>
                                    </li>
                                </ol>

                            </div>
                            <div class="tips"></div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="nutrition-wrapper">
                <div class="top">
                    <div class="top-wrapper"> <img src="../image/营养保健科.svg" alt="" class="top-img"></div>
                    <span class="title">营养价值</span>
                </div>
                <div class="bottom">
                    <div class="new-left">
                        <img src="../image/yycf.png" alt="" class="new-left-img">
                    </div>
                </div>
            </div>
            <div class="problem-wrapper">
                <div class="top">
                    <div class="top-wrapper"> <img src="../image/问题记录.svg" alt="" class="top-img"></div>
                    <span class="title">问答</span>
                </div>
                <div class="problem-bottom">
                    <div class="problem-left">
                        <img src="../image/lsfqa.png" alt="" class="problem-left-img">
                    </div>

                </div>
            </div>
            <!-- 详情页面结束 -->
        </div>

    </div>

    <!-- 底部开始 -->
    <div class="footer-container">
        <div class="footer-wrapper">
            <div>Copyright © 我的家乡2022 猫猫</div>
        </div>
    </div>
    <!-- 底部结束 -->

    <a href="#to-head">
        <div class="helper-wrapper">
            <div class="to-top">
                <div class="to-top-img">
                    <img src="../image/totop.svg" alt="">
                </div>
                <span class="to-top-title">顶部</span>
            </div>
        </div>
    </a>

</body>

</html>